<style lang="less">
    @import "corporateTransferForChannel.less";
</style>
<template>
    <div>
        <Card>
            <Row>
                <Form  ref="searchForm" :model="searchForm" inline :label-width="90" class="search">
                    <div class="search">
                        <Row>
                            <Col align="left">
                                <Form-item label="申请编号" prop="caseNo">
                                    <Input type="text" v-model="searchForm.caseNo" clearable placeholder="请输入申请编号"/>
                                </Form-item>
                                <Form-item label="客户姓名" prop="custName">
                                    <Input type="text" v-model="searchForm.custName" clearable placeholder="请输入客户姓名"/>
                                </Form-item>
                                <Form-item label="到账银行" prop="receivingBank">
                                    <Select v-model="searchForm.receivingBank"  clearable placeholder="请选择到账银行">
                                        <Option
                                            v-for="(item,index) in dataDict.bankCode"
                                            :key="index"
                                            :value="item.value"
                                        >{{item.title}}</Option>
                                    </Select>
                                </Form-item>
                                <Form-item label="处理状态" prop="caseStatus">
                                    <Select v-model="searchForm.caseStatus"  clearable placeholder="请选择处理状态">
                                        <Option
                                            v-for="(item,index) in dataDict.caseStatus"
                                            :key="index"
                                            :value="item.value"
                                        >{{item.title}}</Option>
                                    </Select>
                                </Form-item>
                                <Form-item label="申请时间" prop="startDate">
                                    <DatePicker v-model="startDate" type="daterange" format="yyyy-MM-dd" clearable
                                                @on-change="startDateRange" placeholder="选择申请时间">
                                    </DatePicker>
                                </Form-item>
                                <Form-item label="全部案件" prop="allCase">
                                    <i-switch v-model="searchForm.allCase" @on-change="getCorporateList" ></i-switch>
                                </Form-item>
                            </Col>
                        </Row>
                        <Row>
                            <Col align="middle">
                                <Form-item>
                                    <Button @click="handleSearch" type="primary" icon="ios-search">搜索</Button>
                                    <Button @click="handleReset" type="primary" icon="ios-trash">重置</Button>
                                </Form-item>
                            </Col>
                        </Row>
                        <Row  class="operation">
                            <Button @click="showContractDetail" type="primary" icon="md-add">新增申请</Button>
                        </Row>
                    </div>
                    <Row>
                        <Table :loading="loading" border :columns="columns" :data="data" sortable="custom"
                               @on-selection-change="showSelect" ref="table">
                            <template slot-scope="{ row, index }" slot="id">
                                <Button v-show="row.caseStatus == 'NOT_SUBMIT'"
                                        type="error" size="small" @click="deleteCorporate(row)">删除</Button>
                                <Button v-show="row.caseStatus == 'NOT_SUBMIT'"
                                        type="error" size="small" @click="editCorporate(row)">编辑</Button>
                            </template>
                            <template slot-scope="{ row, index }" slot="caseNo">
                                <span><a @click="showDetail(row)">{{row.caseNo}}</a></span>
                            </template>
                            <template slot-scope="{ row, index }" slot="caseStatus">
                                <span>{{setDictTitleByType('caseStatus',row.caseStatus)}}</span>
                            </template>
                            <template slot-scope="{ row, index }" slot="caseType">
                                <span>{{setDictTitleByType("caseType",row.caseType)}}</span>
                            </template>
                            <template slot-scope="{ row, index }" slot="receivingBank">
                                <span>{{setDictTitleByType("bankCode",row.receivingBank)}}</span>
                            </template>
                        </Table>
                    </Row>
                    <Row type="flex" justify="end" class="page">
                        <Page :current="searchForm.pageNumber" :total="total" :page-size="searchForm.pageSize"
                              @on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10,20,50]"
                              size="small" show-total show-elevator show-sizer></Page>
                    </Row>
                </Form>
            </Row>
        </Card>
        <Modal
            :title="modalTitle"
            v-model="modalVisible"
            :mask-closable="false"
            :width="1200"
            :styles="{top: '50px'}" :footer-hide="true"
        >
            <detailForChannelView v-show="viewModel" ref="detailForChannelView" :obj="viewObj"></detailForChannelView>
            <detailForChannelEdit v-show="editModel" ref="detailForChannelEdit" :obj="viewObj" @afterHandle="afterHandle"></detailForChannelEdit>
        </Modal>
    </div>
</template>

<script>
    import {
        getByTypes
    } from "_p/basic/api/admin/datadic";
    import {
        queryCorporateList,
        deleteCorporateTransfer
    } from "@/projects/afs-apply/api/contract/corporate/corporateTransferManagement";

    import detailForChannelEdit from "./detailForChannelEdit";
    import detailForChannelView from "./detailForChannelView";

    export default {
        name: "corporate-transfer-for-channel",
        components:{
            detailForChannelEdit,
            detailForChannelView
        },
        data() {
            return {
                viewModel:false,
                dealModel:false,
                editModel:false,
                modalTitle:"",
                modalVisible:false,
                startDate: null,
                endDate: null,
                searchForm:{
                    caseNo:"",custName:"",receivingBank:"",caseStatus:"",startTimeS:"",
                    startTimeE:"",allCase:false
                },
                data:[],
                dataForExport:[],
                total: 0,
                dicKeys: [
                    "bankCode","caseStatus","caseType","PersonRoleType","contractStatus","channelType"
                ],
                dataDict:{},
                loading: false,
                columns: [
                    {title: "操作",key: "id",minWidth: 150,align: "center",slot: "id",fixed:"left",slot: "id"},
                    {title: "申请编号",key: "caseNo",minWidth: 160,align: "center",slot: "caseNo"},
                    {title: "客户姓名",key: "custName",minWidth: 150,align: "center"},
                    {title: "联系方式",key: "phone",minWidth: 150,align: "center"},
                    {title: "申请时间",key: "startTime",minWidth: 150,align: "center"},
                    {title: "处理状态",key: "caseStatus",minWidth: 150,align: "center",slot: "caseStatus"},
                    {title: "结束时间",key: "endTime",minWidth: 150,align: "center"},
                    {title: "还款类型",key: "caseType",minWidth: 150,align: "center",slot:"caseType"},
                    {title: "到账银行",key: "receivingBank",minWidth: 150,align: "center",slot:"receivingBank"},
                    {title: "打款时间",key: "payTime",minWidth: 150,align: "center"},
                    {title: "打款金额",key: "payAmt",minWidth: 150,align: "center"},
                    {title: "打款人",key: "payer",minWidth: 150,align: "center"},
                ],
                viewObj:{
                    caseNo: "",
                    contractNo: "",
                    id:""
                },
                contractBusiness: "corporateTransfer",
                modal: false
            }
        },
        computed:{
        },
        methods:{
            closeModal() {
                this.modal = false;
            },
            startDateRange(v) {
                if (v) {
                    this.searchForm.startTimeS = v[0];
                    this.searchForm.startTimeE = v[1];
                }
            },
            handleSearch() {
                this.searchForm.pageNumber = 1;
                this.searchForm.pageSize = 10;
                this.getCorporateList();
            },
            handleReset() {
                this.$refs.searchForm.resetFields();
                this.searchForm.pageNumber = 1;
                this.searchForm.pageSize = 10;
                this.startDate = null;
                this.endDate = null;
                this.searchForm.startTimeS = "";
                this.searchForm.startTimeE = "";

                // 重新加载数据
                this.getCorporateList();
            },
            changePage(v) {
                this.searchForm.pageNumber = v;
                this.getCorporateList();
            },
            changePageSize(v) {
                this.searchForm.pageSize = v;
                this.getCorporateList();
            },
            initDataDic(){
                let self = this;
                getByTypes(this.dicKeys).then(res => {
                    if (res.code === "0000" && res.data) {
                        self.dataDict = res.data;
                    }
                });
            },
            getDic(v){
                let dic = []
                switch(v) {
                    case "caseStatus":
                        dic = this.dataDict.caseStatus;
                        break;
                    case "caseType":
                        dic = this.dataDict.caseType;
                        break;
                    case "bankCode":
                        dic = this.dataDict.bankCode;
                        break;
                    default:
                }
                return dic;
            },
            setDictTitleByType(v1,v2){
                let dic = {}
                if(!this.getDic(v1)) return '';
                this.getDic(v1).forEach(column => {
                    if(column.value === v2){
                        dic = column;
                    }
                });
                return dic.title;
            },
            showSelect(e) {
                this.selectList = e;
                this.selectCount = e.length;
            },
            showDetail(v){
                this.modalTitle = "案件详情";
                this.dealModel = false;
                this.editModel = false;
                this.viewModel = true;
                this.viewObj.caseNo = v.caseNo;
                this.viewObj.contractNo = v.contractNo;
                this.viewObj.id = v.id;
                this.$refs.detailForChannelView.init();
                this.modalVisible = true;
            },
            editCorporate(v){
                this.modalTitle = "未提交案件编辑";
                this.viewModel = false;
                this.dealModel = false;
                this.editModel = true;
                this.viewObj.caseType = v.caseType;
                this.viewObj.contractNo = v.contractNo;
                this.viewObj.caseNo = v.caseNo;
                this.viewObj.id = v.id;
                this.$refs.detailForChannelEdit.init();
                this.modalVisible = true;
            },
            showContractDetail(params) {
                this.modalTitle = "新增月供还款";
                this.viewModel = false;
                this.dealModel = false;
                this.editModel = true;
                this.viewObj.caseType = "RENT";
                this.viewObj.contractNo = "N888888";
                // this.viewObj.contractNo = params.contractNo;
                this.viewObj.caseNo = "";
                this.viewObj.id = "";
                this.$refs.detailForChannelEdit.init();
                this.modalVisible = true;
            },
            afterHandle(){
                this.modalVisible = false;
                this.getCorporateList();
            },
            deleteCorporate(v){
                deleteCorporateTransfer(v.id).then(res => {
                    if (res.code === "0000") {
                        this.$Message.success(res.data);
                        this.getCorporateList();
                    }
                });
            },
            getCorporateList() {
                // 多条件搜索任务列表
                this.loading = true;
                queryCorporateList(this.searchForm).then(res => {
                    this.loading = false;
                    if (res.code === "0000") {
                        this.data = res.data.records;
                        this.total = res.data.total;
                    }
                });
                this.selectCount=0;
            },
            init(){
                this.searchForm.pageNumber = 1;
                this.searchForm.pageSize = 10;
                this.getCorporateList();
            },
        },
        mounted() {
            this.initDataDic();
            this.init();
        }
    }
</script>

<style scoped>

</style>
